<template>
	<view>
		<u-navbar v-if="!$isWeixin()" :custom-back="backToList" :title="title" :titleWidth="450" :titleBold="true" :is-fixed="true">
			<template slot="right">
				<view class="u-p-r-40 u-flex"><u-image @click="showSearchPopup = true" src="@/static/images/search-active.png" :width="40" :height="40"></u-image></view>
			</template>
		</u-navbar>

		<view class="u-flex-col u-col-bottom u-p-t-20" v-if="$isWeixin()">
			<view class="u-p-r-40 u-flex"><u-image @click="showSearchPopup = true" src="@/static/images/search-active.png" :width="40" :height="40"></u-image></view>
		</view>

		<view class="review-list" :class="{ 'scroll-lock': showSearchPopup }">
			<view class="review-item" v-for="(item, index) in reviewList" :key="index">
				<!-- <text class="level">等级：{{ item.Level == 1 ? '一级' : item.Level == 2 ? '二级' : '门店' }}</text> -->
				<view class="title u-flex">
					<text class="dealer-name">一级经销商:</text>
					<text class="">{{ item.FirstName }}</text>
				</view>
				<view class="title u-flex">
					<text class="dealer-name">二级经销商:</text>
					<text class="">{{ item.SecondName }}</text>
				</view>
				<view class="title u-flex">
					<text class="dealer-name">门店:</text>
					<text class="">{{ item.DoorName }}</text>
				</view>
				<view class="grid-list">
					<text>总监：{{ item.DirectorName }}</text>
					<text>销售经理：{{ item.SalseManagerName }}</text>
					<text>城市经理：{{ item.DealerTerminalName }}</text>
					<text>团队负责人：{{ item.TeamLeaderName }}</text>
					<view>
						状态：
						<text style="font-weight: bold;" :style="{ color: item.FontColor }">{{ item.StateName }}</text>
					</view>
					<text>申请人：{{ item.ApplyForManagerName }}</text>
					<text class="u-font-22" style="grid-column-start: 2 span ;">申请时间：{{ (item.Created * 1000) | date('yyyy-mm-dd hh:MM:ss') }}</text>
				</view>
				<view class="btn-group"><u-button size="mini" @click="toDetailPage(item)">查看</u-button></view>
			</view>

			<u-loadmore :status="status" />
		</view>

		<u-popup :border-radius="24" width="600" v-model="showSearchPopup" mode="right">
			<view class="u-p-30">
				<search-form
					v-model="searchParams"
					:showLevel="false"
					:showApplyType="false"
					:showIsKeeding="false"
					:splitDealerName="true"
					@change="onSearchChange"
					:metadata="metadata"
					@close="showSearchPopup = false"
				></search-form>
			</view>
		</u-popup>
	</view>
</template>

<script>
export default {
	data() {
		return {
			title: '模板样机验收审核列表',
			showSearchPopup: false,
			IsFirst: true,
			reviewPage: {
				Items: [],
				PageCount: 0,
				PageIndex: 0,
				PageSize: 10,
				TotalCount: 0
			},
			reviewList: [],
			status: 'loadmore',

			metadata: {
				DealerDivisionList: [],
				DealerTerminalList: [],
				DirectorList: [],
				RegionalDirectorList: [],
				SalesServiceList: [],
				SalseList: [],
				SeniorDealerTerminalList: [],
				TeamList: [],
				AuditStateBaseList: []
			},

			searchParams: {
				DirectorId: null,
				SalseId: null,
				DealerTerminalId: null,
				TeamId: null,
				SeniorDealerTerminalId: null,
				DealerDivisionId: null,
				SalesService: null,
				RegionalDirector: null,
				DealerName: '',
				StartTime: null,
				EndTime: null,
				Level: null,
				ApplayType: null,
				First_DealerName: '',
				Double_DealerName: '',
				DoorName: '',
				IsKeeding: null,
				AuditState: null
			}
		};
	},

	onLoad(options) {
		this.getData();

		if (this.$isWeixin()) {
			this.$setTitle(this.title);
		}
	},
	
	// 触底事件
	onReachBottom() {
		if (this.reviewPage.PageIndex + 1 >= this.reviewPage.PageCount) return;
		this.status = 'loading';
		this.reviewPage.PageIndex = this.reviewPage.PageIndex + 1;
		this.getData();
	},

	methods: {
		backToList() {
			uni.navigateBack()
		},

		toDetailPage(item) {
			this.$u.route({
				url: '/pages/review/module/acceptanceDetail',
				params: {
					DealerId: item.DealerId,
					AcceptanceAuditId: item.AcceptanceAuditId
				}
			});
		},

		isTransferKingDee(a, b, ModultState) {
			var str = '';
			if (ModultState != 0 && ModultState != '' && ModultState != null) {
				//审核驳回没有传输状态
				if (ModultState == 3 || ModultState == 5 || ModultState == 7) {
					str = "<text style='color:green;'></text>";
				} else {
					switch (a) {
						case 0:
							str = "<text style='color:green;'>已传输</text>";
							break;
						default:
							str = "<text style='color:red;'>未传输</text>";
							break;
					}
					if (b == 0) {
						//状态全部为3
						str = "<text style='color:green;'>已发货</text>";
					}
				}
			} else {
				str = "<text style='color:red;'></text>";
			}
			return str;
		},

		onSearchChange(e) {
			this.showSearchPopup = false;
			this.reviewPage.PageIndex = 0;
			this.$nextTick(() => {
				this.getData(true);
			});
		},

		getData(reload) {
			this.$u.api
				.getModuleAcceptanceReviewList(
					Object.assign(
						{
							IsFirst: this.IsFirst,
							Level: this.Level,
							Pageindex: this.reviewPage.PageIndex,
							Pagesize: this.reviewPage.PageSize
						},
						this.searchParams
					)
				)
				.then(res => {
					const { ResultCode, ResultMessage, ResultData } = res;
					if (ResultCode === 1) {
						const {
							AuditList,
							AuditStateBaseList,
							DirectorList,
							SalseList,
							DealerTerminalList,
							TeamList,
							SeniorDealerTerminalList,
							DealerDivisionList,
							RegionalDirectorList,
							SalesServiceList
						} = ResultData;

						if (this.IsFirst) {
							this.metadata.DealerDivisionList = DealerDivisionList;
							this.metadata.DealerTerminalList = DealerTerminalList;
							this.metadata.DirectorList = DirectorList;
							this.metadata.RegionalDirectorList = RegionalDirectorList;
							this.metadata.SalesServiceList = SalesServiceList;
							this.metadata.SalseList = SalseList;
							this.metadata.SeniorDealerTerminalList = SeniorDealerTerminalList;
							this.metadata.TeamList = TeamList;
							this.metadata.AuditStateBaseList = AuditStateBaseList;
							this.IsFirst = false;
						}

						if (AuditList) {
							this.reviewPage = AuditList;
							if (reload) {
								this.reviewList = AuditList.Items;
							} else {
								this.reviewList.push(...AuditList.Items);
							}

							if (this.reviewPage.PageIndex + 1 >= this.reviewPage.PageCount) {
								this.status = 'nomore';
							}
						} else {
							this.reviewList = [];
							this.status = 'nomore';
						}
					}
				});
		}
	}
};
</script>

<style>
page {
	background-color: #eaecef;
}
</style>
<style lang="scss" scoped>
.review-list {
	padding: 20rpx;
}

.review-item {
	display: flex;
	flex-direction: column;
	background-color: #ffffff;
	border-radius: 12rpx;
	font-size: 22rpx;
	color: #2e2f32;
	padding: 20rpx 40rpx;
	margin-bottom: 20rpx;

	.dealer-name,
	.c_name {
		color: #ff7a23;
		font-weight: bold;
		// font-size: 28rpx;
	}

	.dealer-name {
		margin-right: 10rpx;
	}

	.title,
	.level {
		line-height: 40rpx;
	}

	.grid-list {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(4, 40rpx);
		line-height: 40rpx;
	}

	.btn-group {
		text-align: right;
	}
}
</style>
